<!DOCTYPE html>
<html lang="zh-cn" class="no-js">
	<head>
		<meta http-equiv="Content-Type">
		<meta content="text/html; charset=utf-8">
		<meta charset="utf-8">
		<title>中国好泡团</title>		
		<meta name="viewport" content="target-densitydpi=device-dpi, width=750px, user-scalable=no">
		<meta name="format-detection" content="telephone=no">
		<meta name="format-detection" content="email=no">
		<script src="/zghpt/js/zepto.min.js"></script>
		<script type="text/javascript">
		function adaptscreen(widthnum){
			try{
			 var DEFAULT_WIDTH = widthnum, // 页面的默认宽度
		        ua = navigator.userAgent.toLowerCase(), // 根据 user agent 的信息获取浏览器信息
		        deviceWidth = window.screen.width, // 设备的宽度
		        devicePixelRatio = window.devicePixelRatio || 1, // 物理像素和设备独立像素的比例，默认为1
		        targetDensitydpi;    // Android4.0以下手机不支持viewport的width，需要设置target-densitydpi
		        if (ua.indexOf("android") !== -1 && parseFloat(ua.slice(ua.indexOf("android")+8)) < 4) {
		        	targetDensitydpi = DEFAULT_WIDTH / deviceWidth * devicePixelRatio * 160;
		        	$('meta[name="viewport"]').attr('content', 'target-densitydpi=' + targetDensitydpi + ', width=device-width, user-scalable=no');
				}else{
					$('meta[name="viewport"]').attr('content', 'target-densitydpi=device-dpi, width='+DEFAULT_WIDTH+'px, user-scalable=no');
				}
			}catch(e){
				console.log('dpi error',e);
			}
	    }
	    adaptscreen(750);
		</script>
		<link rel="stylesheet" type="text/css" href="/zghpt/css/reset.css?v=6" />
		<link rel="stylesheet" type="text/css" href="/zghpt/css/index.css?v=7" />
		<link rel="stylesheet" type="text/css" href="/zghpt/css/animations.css?v=6" />
        <link rel="stylesheet" type="text/css" href="/zghpt/css/load.css?v=6" /> 
        <link rel="stylesheet" type="text/css" href="/zghpt/css/loading.css?v=6" /> 
	</head>
	<body>
    <div id="loading">
     	<div class="spinner">
  			<div class="double-bounce1"></div>
  			<div class="double-bounce2"></div>
		</div>
	</div>

	<div id="mask"></div>

	<div id="content" style="display:none">

		<div class="page page-1-1 page-index" data-lock-up="1" data-lock-down="1">
			<div class="wrap">

				<div class="user-wrap">

					<div class="head-wrap">
						<img class="head-main" id="userHead" src="" />
					</div>
					<div class="user-name" id="userName"></div>
					<div class="head-time" id="userCountTime">--:--</div>
					<div class="blank"></div>

					<div class="gold-wrap-t" id="cashNumber"></div>
					<div class="gold-wrap-b" id="coinNumber"></div>

					<!-- user-info start -->
					<div class="user-info clearfix">
						<div class="fl">
							<p>您当前解锁了<b id="unlockPacketNumber"></b>个好泡团红包</p>
							<p>您目前有<span id="starFansNumber"></span>个皇冠粉丝，差<b id="leftStarFansNumber"></b>个即可生成新的红包</p>
						</div>
						<div class="fr">
							<div class="packet" id="packetProcess">
								<div class="pic"></div>
								<canvas class="circle-mask" id="circleMask" width="120" height="120"></canvas>
								<div class="lock hide"></div>
							</div>
							<p class="tips" id="leftCrownNumber"></p>
						</div>
					</div>
					<!-- user-info end -->

				</div>

				<div class="list-wrap">
					<ul id="fansList"></ul>
				</div>

			</div>
		</div>

		<!-- loading 动画 -->
		<div class="loading-wrap hide">
			<div class="loader">
				<div class="loader-inner ball-pulse">
					<div></div>
					<div></div>
					<div></div>
				</div>
			</div>
		</div>
		<!-- loading 动画 end -->

    </div>

    <!-- 红包弹窗 带倒计时 -->
    <div class="window-wrap red-pack js-red-pack hide">
    	<div class="window-mask"></div>
    	<div class="window-main pt-page-bounceIn">
    		<img class="rp-head" src="" />
    		<div class="rp-name"></div>
    		<div class="rp-close"></div>
    	</div>
    </div>
    <!-- 红包弹窗end -->

     <!-- 红包弹窗 带金额 -->
     <div class="window-wrap red-pack-big js-red-pack-big hide">
    	<div class="window-mask"></div>
    	<div class="window-main pt-page-bounceIn">
    		<img class="rp-head" src="" />
    		<div class="rp-name"></div>
    		<div class="rp-close"></div>
    		<!--<div class="rp-title">尤物会红包</div>-->
    		<div class="rp-rmb"><span>小妖币</span></div>
			<div class="rp-rmb-note">可抽现金红包</div>
    		<div class="rp-price"><span>金币</span></div>
    		<div class="rp-price-note">可用于购买商城产品</div>
    	</div>
    </div>
     <!-- 红包弹窗 end -->

    <!-- 解锁成功 start -->
    <div class="window-wrap deblocking-success js-deblocking-success hide">
    	<div class="window-mask"></div>
    	<div class="window-main pt-page-bounceIn">
    		<div class="unlock-pic"></div>
    		<div class="text">恭喜你解锁成功，获得</div>
    		<div class="cash"><i></i><b id="unlockSuccessMoney"></b></div>
    		<a href="javascript:;" class=btn>生成推广海报</a>
    		<span class="close"></span>
    	</div>
    </div>
    <!-- 解锁成功 end -->

    <!-- 解锁失败 start -->
    <div class="window-wrap deblocking-failed js-deblocking-failed hide">
    	<div class="window-mask"></div>
    	<div class="window-main pt-page-bounceIn">
    		<div class="unlock-pic"></div>
    		<div class="text">对不起，粉丝皇冠还未满<span class="total"></span>人</div>
    		<div class="cash">赶紧做任务去！</div>
    		<a href="javascript:;" class=btn>确认</a>
    		<span class="close"></span>
    	</div>
    </div>
    <!-- 解锁失败 end -->

	<!-- alert start -->
    <div class="window-wrap alert-msg js-alert-msg hide">
    	<div class="window-mask"></div>
    	<div class="window-main pt-page-bounceIn">
			<div class="window-main-inn">
				<span class="text"></span>
				<span class="close"></span>
			</div>
    	</div>
    </div>
	<!-- alert end -->

    <div id="share">
    	<div class="shareImg"></div>
    </div>

    <div class="tisblock mask"></div>
    <div class="tisblock main"></div>

    <script type="text/javascript">
	document.onreadystatechange = loading; 
	var loading_pc_num=0;
	var loading_pc=setInterval(function(){
		loading_pc_num+=parseInt(Math.random()*6);
		$('.loading_main').html(loading_pc_num+'%');
		if(loading_pc_num>90){
			clearInterval(loading_pc);
		}
	},300);

	function loading(){
		if(document.readyState == "complete"){
			loading_pc_num=94;
			setTimeout(function(){
				startpage();
			},100);
		}
	}

	function startpage(){
		$("#loading").hide();
		$("#content").show();
		//goNext();
	}
	
	$(function(){
		var curDate = new Date();
		var timer = {};
		var nowGetPacketListIndex = null; // 当前抢取的红包列表索引，当为null时，是抢取自己的
		var UID = null; // 用户uid
		var reCountTime = 0; // 重新倒计时的时间
		var page = 1; // 初始页数
		var canNextPage = true; // 是否可下拉加载
		var leftUnlockTimes = 0; // 剩余可解锁的红包数
		var remainder = 0; // 差的皇冠数（余数）

		// 入口
		getUserInfo(function(jdata) {

            var user = jdata.data.user;

			leftUnlockTimes = Math.floor(user.fans_crown_count / user.count) - user.unlock_count
			remainder = user.fans_crown_count % user.count;

			$('#userName').attr('uid', user.id)

			$('#cashNumber').html( parseInt(user.XYB * 100) ); // 金钱
			$('#coinNumber').html(user.JB); // 金币
			$('#userHead').attr('src', user.avatar); // 用户头像
			$('#userName').html(user.nickname); // 用户名
			$('#userCountTime').attr('lasttime', user.next_second); // 用户倒计时

			$('#unlockPacketNumber').html(user.unlock_count); // 解锁的红包数
			$('#starFansNumber').html(user.fans_crown_count); // 皇冠粉丝数
			$('#leftStarFansNumber').html(user.need_unlock_count); // 剩余皇冠粉丝数

			$('.js-deblocking-failed .total').html(user.count); // 未解锁弹层总数

			// 红包奖励
			var packetProcess = 1 - user.crown_hb_percent / 100;

			if ( user.crown_hb_can_get == 1 ) {
				// 皇冠数已凑满
				$('#packetProcess').addClass('packet--unlock').find('.lock').removeClass('hide');
				$('#leftCrownNumber').html('解锁成功');
				$('#circleMask').addClass('hide');
			} else {
				// 显示蒙层百分比
				$('#packetProcess .lock').removeClass('hide');
				$('#leftCrownNumber').html('您还差' + user.need_unlock_count + '个皇冠即可解锁');
			}
			
			// 粉丝列表
			canNextPage = false;
			getFansList();
			initCircleMask(packetProcess);
			initDaojishi(); // 初始化倒计时

		});
		
		// 点击解锁红包
		$('#packetProcess').on('tap', function() {
			if ( !$(this).hasClass('packet--unlock') ) {
				// 未解锁成功
				$('.js-deblocking-failed').removeClass('hide');
			} else {
				// 解锁成功
				UID = $('#userName').attr('uid');
				getUnlockedPacket();
			}
		});

		// 抢取自己的红包
		$('#userCountTime').on('tap', '.btn', function() {
			var userName = $('#userName').text();
			var userHead = $('#userHead').attr('src');
			nowGetPacketListIndex = null;
			UID = $('#userName').attr('uid');
			getPacket(userName, userHead);
		});

		// 点击粉丝列表
		$('body').on('tap', '#fansList li', function(){
			var index = $('#fansList li').index($(this));
			var userName = $(this).attr('username');
			var userHead = $(this).find('.head-li').attr('src');
			UID = $(this).attr('uid');

			if( $(this).hasClass('add') ){
				// 生成二维码
				createQrcode();
				return;
			}

			nowGetPacketListIndex = index;

			if( $(this).hasClass('can-click') ){
				// 打开大红包弹层
				getPacket(userName, userHead);
			}else{
				// 打开小红包弹层
				$('.js-red-pack .rp-name').html(userName);
				$('.js-red-pack .rp-head').attr('src', userHead);

				var lastTime = $(this).find('.head-time').attr('lasttime');
				var curDate = $(this).find('.head-time').data('curDate');

				$('.js-red-pack .window-main').append('<div class="rp-time" lasttime="' + lastTime + '">----</div><div class="rp-bt">等待开抢</div>');
				$('.js-red-pack .window-main .rp-time').data('curDate', curDate);
				$('.js-red-pack').removeClass('hide');
			}
		});

		// 翻页
		$(window).scroll(function(){
		　　var scrollTop = $(this).scrollTop();
		　　var scrollHeight = $(document).height();
		　　var windowHeight = $(this).height();
			// console.log(scrollHeight,scrollTop,windowHeight);
		　　if(scrollHeight - scrollTop <= windowHeight + 10 && canNextPage){
		　　　　console.log('到底了');
				$('.loading-wrap').removeClass('hide');
				canNextPage = false;
				getFansList();
		　　}
		});

		// 弹层相关
		(function() {
			// 小弹层点击“抢取”按钮
			$('body').on('tap', '.js-red-pack .rp-bt', function(){
				var $target = $('#fansList li').eq(nowGetPacketListIndex);

				if ( !$(this).hasClass('red') )  return;
				if ( !$target.hasClass('can-click') )  return;

				var userName = $target.attr('username');
				var userHead = $target.find('.head-li').attr('src');
				
				getPacket(userName, userHead, function() {
					$('.js-red-pack .window-main .rp-time, .js-red-pack .window-main .rp-bt').remove();
					$('.js-red-pack').addClass('hide');
				});
			});

			// 关闭"小红包"弹层
			$('body').on('tap', '.js-red-pack .rp-close', function(){
				$('.js-red-pack .window-main .rp-time, .js-red-pack .window-main .rp-bt').remove();
				$('.js-red-pack').addClass('hide');
			})
			
			// 关闭"大红包"弹层
			$('.js-red-pack-big .rp-close').on('tap', function(){
				$('.js-red-pack-big').addClass('hide');
			})

			// 关闭"解锁成功"弹层
			$('.deblocking-success .close').on('tap', function(){
				$('.deblocking-success').addClass('hide');
			})

			// "解锁成功"弹层生成海报按钮
			$('.deblocking-success .btn').on('tap', function(){
				createQrcode();
				$('.deblocking-success').addClass('hide');
			})

			// 关闭"解锁未成功"弹层
			$('.deblocking-failed .btn, .deblocking-failed .close').on('tap', function(){
				$('.deblocking-failed').addClass('hide');
			})

			// alert弹层 mask关闭
			$('.js-alert-msg .window-mask').on('tap', function() {
				$('.js-alert-msg').addClass('hide');
			})
			
			// alert弹层 按钮关闭
			$('.js-alert-msg .close').on('tap', function() {
				$('.js-alert-msg').addClass('hide');
			})
		}())

		// 生成二维码
		function createQrcode() {
			if ( Math.round(new Date().getTime()/1000) < 1485000000 ) {
        		showAlert('2017年1月21日20点二维码开放');
        		return;	
        	}

			showAlert('二维码正在生成中<br>稍后发到您手机');
			$.ajax({
				type: "get",
				url: "/api/user/qrcode",
				data: {
				},
				success: function(jdata){
					// if (jdata.code == 1000) {
						// alert('二维码正在生成中，稍后发到您手机');
					// } else {
					// 	alert(jdata.msg);
					// }
				},
				error: function(){
				}
			});
		}

		// 还原红包状态
		function resetPacketState() {
			if (nowGetPacketListIndex == null) {
				// 抢取自己的，关闭
				var $target = $('#userCountTime');
				$target
					.attr('lasttime', reCountTime)
					.data('curDate', new Date())
					.html('----');
			} else {
				// 抢取别人的，关闭
				var $target = $('#fansList li').eq(nowGetPacketListIndex);
				$target.removeClass('can-click');
				var $time = $target.find('.head-time');
				$time
					.attr('lasttime', reCountTime)
					.data('curDate', new Date())
					.html('----');
			}
		}

		// 初始化圆圈蒙层
		function initCircleMask(percent) {
			var circ = Math.PI * 2;
			var quart = Math.PI / 2;

			var bg = document.getElementById('circleMask');
			var cxt = bg.getContext('2d'); //创建context对象
			cxt.fillStyle = '#000000'; //设置或返回用于填充绘画的颜色、渐变或模式 染成红色
			cxt.strokeStyle="#000000"; //设置或返回用于笔触的颜色、渐变或模式
			//cxt.lineCap = 'square'; //设置或返回线条的结束端点样式
			cxt.beginPath(); //起始一条路径，或重置当前路径
			cxt.moveTo(60,60); //把路径移动到画布中的指定点，不创建线条

			function draw(current){

			//cxt.lineTo(60,0); //添加一个新点，然后在画布中创建从该点到最后指定点的线条
			cxt.arc(60,60,59,-0.5*Math.PI,current*(2*Math.PI) - Math.PI/2,false); //绘制一个中心点为（100,100），半径为100，起始点为1.5*Math.PI,终点为2*Math.PI,顺时针的1/4圆
			cxt.closePath(); //创建从当前点回到起始点的路径
			cxt.fill();//填充当前绘图（路径）
			//cxt.lineWidth = 10.0; //设置或返回当前的线条宽度
			cxt.stroke(); //绘制已定义的路径
			}
			//draw(0.6);
			var t=0;
			var timer2=null;
			function loadCanvas(now){
				timer2 =  setInterval(function(){
					if(t>now){
						draw(now);
						clearInterval(timer2);
					}else{
						draw(t);
						t += 0.01;
					}
					},1);
			}
			loadCanvas(percent);
			// timer2=null;
		}

		// 拼装粉丝列表html
		function constructFansListHTML(list) {
			var returnValue = '';

			for (var i = 0; i < list.length; i++) {
				var item = list[i];
				var levelHTML = item.level ? '<img class="head-mark" src="/zghpt/imgs/list_mark.png" />' : '';

				if (item.next_second > 0) {
					// 不可摘取
					returnValue += '<li uid="' + item.id + '" username="' + item.nickname + '">' +
										'<img class="head-li" src="' + item.avatar + '" />' + levelHTML +
										'<div class="head-time" lasttime="' + item.next_second + '" data-cur-date="' + new Date() + '">----</div>' +
									'</li>';
				} else {
					// 可摘取
					returnValue += '<li uid="' + item.id + '" username="' + item.nickname + '" class="can-click">' +
										'<img class="head-li" src="' + item.avatar + '" />' + levelHTML +
										'<div class="head-time"><span class="btn">立即领取</span></div>' +
									'</li>';
				}

			}

			return returnValue;
		}

		// 领取解锁的红包
		function getUnlockedPacket() {
			showLoading();

            $.ajax({
                type: "get",
                url: "/api/zghpt/hb/unlock",
                data: {
					from_user: UID
                },
                success: function(jdata){
					hideLoading();
					
					if (jdata.code == 1000) {
						leftUnlockTimes--;

						var XYB = parseInt(jdata.data.money * 100);

						$('#unlockPacketNumber').html( parseInt($('#unlockPacketNumber').text()) + 1 ); // 解锁的红包数
						$('#unlockSuccessMoney').html(XYB); // 解锁成功的金钱数
						$('.js-deblocking-success').removeClass('hide'); // 显示成功弹层
						$('.js-deblocking-failed .total').html(jdata.data.count); // 未解锁弹层总数

						if (leftUnlockTimes <= 0) {
							console.log('no unlocked');
							// 没有未解锁红包
							remainder = jdata.data.count - remainder;
							$('#packetProcess').removeClass('packet--unlock'); // 变成未解锁
							initCircleMask( (remainder / jdata.data.count).toFixed(1) ); // 重绘圆形蒙层
							$('#circleMask').removeClass('hide'); // 显示圆形蒙层
							$('#leftStarFansNumber').html(remainder); // 差几个可解锁
							$('#leftCrownNumber').html('您还差' + remainder + '个皇冠即可解锁'); // 差几个可解锁
						} else {
							console.log('has unlocked');
							// 还有未解锁红包
							$('#leftStarFansNumber').html(0); // 差几个可解锁
							$('#leftCrownNumber').html('您还差0个皇冠即可解锁'); // 差几个可解锁
						}

						if (jdata.data.status == 1) {
							$('#cashNumber').html( Number($('#cashNumber').text()) + XYB);
							// $('#coinNumber').html( Number($('#coinNumber').text()) + jdata.data.score);
						}
						
					} else {
						showAlert(jdata.msg);
					}
                },
                error: function(){
                }
            });
		}

		// 获取粉丝列表
		function getFansList() {
            $.ajax({
                type: "get",
                url: "/api/zghpt/hb/fans",
                data: {
					page: page
                },
                success: function(jdata){

					if (jdata.code == 1000) {
						var dataList = jdata.data.data;

						if (!dataList.length) {

							if (page == 1) {
								var HTML =  '<li class="add">' +
												'<img class="head-li" src="/zghpt/imgs/add.png" />' +
											'</li>';
								$('#fansList').append(HTML);
							}

							$('.loading-wrap').addClass('hide');
							return;
						}

						if (page == 1) {
							var HTML = constructFansListHTML(dataList) + '<li class="add">' +
																			'<img class="head-li" src="/zghpt/imgs/add.png" />' +
																		'</li>';
							$('#fansList').append(HTML);
						} else {
							$('#fansList .add').before( constructFansListHTML(dataList) );
						}
						
						++page;
						canNextPage = true;
						$('.loading-wrap').addClass('hide');

					} else {
						showAlert(jdata.msg);
					}
                },
                error: function(){
                }
            });
		}

		// 抢取红包
		function getPacket(userName, userHead, callback) {
			showLoading();

            $.ajax({
                type: "get",
                url: "/api/zghpt/hb/create",
                data: {
					from_user: UID
                },
                success: function(jdata){
					hideLoading();

					if (jdata.code == 1000) {

						reCountTime = jdata.data.surplus_time;

						// 还原红包状态
						resetPacketState();

						var XYB = parseInt(jdata.data.money * 100);

						$('.js-red-pack-big').removeClass('hide');
						$('.js-red-pack-big .rp-name').html(userName);
						$('.js-red-pack-big .rp-head').attr('src', userHead);
						$('.js-red-pack-big .rp-rmb').html(XYB + '<span>小妖币</span>');
						$('.js-red-pack-big .rp-price').html(jdata.data.score + '<span>金币</span>');

						if (jdata.data.status == 1) {
							$('#cashNumber').html( Number($('#cashNumber').text()) + XYB );
							$('#coinNumber').html( Number($('#coinNumber').text()) + jdata.data.score);
						} else {
							// showAlert('您不是vip，错过了'+ XYB +'元红包');
							showAlert('您不是vip，错过了'+ XYB +'小妖币');
						}

						(typeof callback != 'undefined') && callback();

					} else {
						showAlert(jdata.msg);
					}
                },
                error: function(){
                }
            });
		}

		// 获取用户信息
		function getUserInfo(callback) {
            $.ajax({
                type: "get",
                url: "/api/zghpt/hb/index",
                data: {
                },
                success: function(jdata){
					if (jdata.code == 1000) {
						(typeof callback != 'undefined') && callback(jdata);
					} else {
						showAlert(jdata.msg);
					}
                },
                error: function(){
                }
            })
		}

		// 格式化倒计时
		function formatSeconds(value) {
			var theTime = parseInt(value);// 秒
			var theTime1 = 0;// 分
			var theTime2 = 0;// 小时
			var toDoubleDigit = function(num) {
					return num > 9 ? num : '0' + num;
				};

			if(theTime > 60) {
				theTime1 = parseInt(theTime/60);
				theTime = parseInt(theTime%60);
			}
			if (theTime1 > 60) {
				theTime2 = parseInt(theTime1/60);
				theTime1 = parseInt(theTime1%60);
			}
			
			var result = "" + toDoubleDigit( parseInt(theTime) ) + '秒';

			if(theTime1 > 0) {
				result = "" + toDoubleDigit( parseInt(theTime1) ) + "分" + result;
			}

			if (theTime2 > 0) {
				result = "" + toDoubleDigit( parseInt(theTime2) ) + "时" + result;
			}

			return result;
		}

		// 初始化倒计时
		function initDaojishi() {

			// 初始化时间
			var tmpDate = new Date();
			$('[lasttime]').each(function(){
				var $this = $(this);
				$this.data('curDate', new Date());
				var restsecond = $(this).attr('lasttime');
				var restNow = parseInt( (restsecond * 1000  - (tmpDate - new Date($this.data('curDate') ) ) )/1000);
				if(restNow > 0){
					$(this).html('倒计时：' + formatSeconds(restNow));
				}
			});

			daojishi();
		}

		// 倒计时
		function daojishi(){
			timer = setInterval(function(){
				var tmpDate = new Date();
				$('[lasttime]').each(function(index){

					var restsecond = $(this).attr('lasttime');
					var restNow = parseInt( (restsecond * 1000  - (tmpDate - new Date( $(this).data('curDate') ) ) )/1000);

					// var restsecond = $(this).attr('lasttime');
					// var restNow = parseInt((restsecond * 1000  - (tmpDate - curDate))/1000);

					if(restNow < 0){

						/*倒计时结束逻辑*/
						restNow = 0;
						$(this).html('<span class="btn">立即抢取</span>');

						// 粉丝列表
						if ( $(this).parents('li').length ) {
							$(this).parents('li').addClass('can-click');
						}

						// 小红包倒计时按钮状态
						if( (nowGetPacketListIndex !== null) && 
							(index == nowGetPacketListIndex) && 
							$('#fansList li').eq(nowGetPacketListIndex).hasClass('can-click') ){
							$('.js-red-pack .rp-bt').addClass('red').html('立即抢取');
						}
						
					}else{
						$(this).html('倒计时：' + formatSeconds(restNow));
					}
				})
			},1000)
		}

		// 金钱toFixed
		function moneyToFixed(money) {
			money = money * 100;
			money = money / 100;
			return money.toFixed(2);
		}

		// alert
		function showAlert(text) {
			$('.js-alert-msg .text').html(text);
			$('.js-alert-msg').removeClass('hide');
		}

		// 显示加载动画
		function showLoading() {
            $("#loading").show();
            $("#mask").show();
		}

		// 隐藏加载动画
		function hideLoading() {
            $("#loading").hide();
            $("#mask").hide();
		}
		
	});
	</script>
	</body>
</html>

